<template>
  <Dropdown placement="right">
    <DropdownItem>
      <div style="color: #fff">{{ props.menuList.name }}</div>
    </DropdownItem>
    <template #list>
      <template v-for="item in props.menuList.child">
        <MiddleCollapseMenu
            v-if="item.child && item.child.length!==0"
            :menu-list="item"
            :key="item.name">
        </MiddleCollapseMenu>
        <DropdownItem v-else>
          <div @click="jumpUrl(item)" style="color: #fff">{{ item.name }}</div>
        </DropdownItem>
      </template>
    </template>
  </Dropdown>
</template>
<script setup>
import router from "@/router";
import {commonStore} from "@/store/store";

const store = commonStore()

const props = defineProps({
  menuList: {
    type: Object,
    default: () => {
    }
  }
})

// 跳转菜单
const jumpUrl = (item) => {
  console.log(item)
  router.push({path: item.path})
  store.addTagsNavList({
    title: item.name,
    name: item.path.slice(1),
    path: item.path
  });
}

console.log(props.menuList)
</script>

<style scoped>

</style>
